import { fileURLToPath, URL } from 'node:url';
import { visualizer } from 'rollup-plugin-visualizer';
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import vueJsx from '@vitejs/plugin-vue-jsx';
import compression from 'vite-plugin-compression';
// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
    vueJsx(),
    // 开启 gzip 压缩
    compression({
      verbose: true,       // 是否在控制台输出压缩信息
      disable: false,      // 是否禁用压缩
      threshold: 10240,    // 只有大于此大小的文件才会被压缩，单位是字节
      algorithm: 'gzip',   // 压缩算法，支持 gzip 和 brotli
      ext: '.gz',          // 生成的压缩文件扩展名
    })
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url)),
    },
  },
  server: {
    port: 8888,
  },
  build: {
    // 生成环境配置
    rollupOptions: {
      plugins: [
        visualizer({
          filename: './dist/bundle-report.html', // 报告生成路径
          open: true, // 打包完成后自动打开浏览器
          gzipSize: true, // 显示 gzip 压缩大小
          brotliSize: true, // 显示 Brotli 压缩大小
        }),
      ],
      external:['moment'], // 需要排除打包的依赖
      // 输出配置
      output: {
        // 将 js, css 和其他资源分配到不同的文件夹
        entryFileNames: 'js/[name]-[hash].js',
        chunkFileNames: 'js/[name]-[hash].js',
        assetFileNames: (assetInfo) => {
          const extType = assetInfo.name!.split('.').pop();
          if (['png', 'jpg', 'jpeg', 'gif', 'svg'].includes(extType!)) {
            return 'images/[name]-[hash][extname]';
          } else if (['css'].includes(extType!)) {
            return 'css/[name]-[hash][extname]';
          } else {
            return 'assets/[name]-[hash][extname]';
          }
        },
        //分割较大的包，在后续进行迭代时，可以充分利用浏览器缓存，减少加载时间
        manualChunks(id) {
       
          // 将 ant-design-vue 拆分到 antd.js
          if(id.includes('node_modules/ant-design-vue')) {
            return 'antd';
          }
          if(id.includes('node_modules/html2canvas')) {
            return 'html2canvas'
          }
             // 将 node_modules 中的依赖拆分到 vendor.js
          if (id.includes('node_modules')) {
            return 'vendor';
          }
        },
      },
    },
  },
});
